<template>
	<div class="index ml-echarts">
	<leftNav></leftNav>
		<h1>1111</h1>
		 <div id="map" class="map" style="width:600px;height:600px;"></div>
	</div>
</template>

<script>
import BMap from 'BMap' 
	export default {

		data() {
			return {

			}
		},
		created() {

		},
		mounted() {
			this.initMap();
			this.$myEchart({
				'options': {
					title: {
						text: '在Vue中使用echarts'
					},
					tooltip: {},
					xAxis: {
						data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
					},
					yAxis: {},
					series: [{
						name: '销量',
						type: 'bar',
						data: [5, 20, 36, 10, 10, 20]
					}]
				},
				"styles":{
					width:'500px',
					height:"600px",
				}
			});
		},
		computed: {

		},
		methods: {
initMap(){
                // 百度地图API功能
                var map = new BMap.Map("map");          
                let point = new BMap.Point(118.750801, 31.944156);

                map.centerAndZoom(point, 15);
                map.enableScrollWheelZoom(true);
                var marker = new BMap.Marker(point); // 创建标注    
                map.addOverlay(marker);  
            }
		}
	}
</script>

<style lang="less" scoped="scoped">
h1{
	font-size:100px;
}
.ml-echarts {
		display: flex;
		section {
			text-align: justify;
			margin-top: 30px;
			line-height: 48px;
			font-size: 18px;
		}
	}
</style>
